<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>显示隐藏相关</title>
    <script src="../js/vue.min.js"></script>
</head>
<body>
<div>
    <!--控制元素是否显示-->
    <h1 v-if="isVisible">刘德华</h1>
    <!--和v-if取反,效果和v-id相反-->
    <h1 v-else="isVisible">张学友</h1>
    <!--和v-if的效果一样,但是v-show的显示样式为隐藏,而v-if是直接删除-->
    <h1 v-show="isVisible">郭富城</h1>
</div>
<script>
    let v= new Vue({
        el:"body>div",
        data:{
            isVisible:true
        }
    })
</script>
</body>
</html>